
{include file="public/meta" /}
<script src="__STATIC__/layui/iconPicker/module/common.js"></script>
</head>

<body class="gray-bg">
    <div class="wrapper wrapper-content">
        <div class="row">
            <div class="col-sm-12">
                <div class="ibox float-e-margins">
                    <!--form元素开始-->
                    <div class="m-t ibox-content layui-form">
                        <div class="layui-form-item">
                            <label class="layui-form-label">菜单</label>
                            <div class="layui-input-block">
                                <select name="pid" lay-verify="required">
                                    <option value="0">顶级菜单</option>
                                    {volist name="auth_rule" id="vo"}
                                        <option value="{$vo.id}">{$vo.title}</option>
                                    {/volist}
                                </select>
                            </div>
                        </div>
                        <div class="layui-form-item">
                            <label class="layui-form-label">菜单名</label>
                            <div class="layui-input-block">
                                <input type="text" name="title" required  lay-verify="required" placeholder="菜单名" autocomplete="off" class="layui-input">
                            </div>
                        </div>
                        <div class="layui-form-item">
                            <label class="layui-form-label">路由</label>
                            <div class="layui-input-block">
                                <input type="text" name="name" required  lay-verify="required" placeholder="顶级菜单输入#（请配置路由）" autocomplete="off" class="layui-input">
                            </div>
                        </div>
                        <div class="layui-form-item">
                            <label for="" class="layui-form-label">图标</label>
                            <div class="layui-input-block">
                                <input type="text" id="iconPicker" lay-filter="iconPicker" class="layui-input" name="icon">
                            </div>
                        </div>
                        <div class="layui-form-item">
                            <label class="layui-form-label">排序</label>
                            <div class="layui-input-block">
                                <input type="text" name="sort" required  lay-verify="required" placeholder="排序" autocomplete="off" class="layui-input">
                            </div>
                        </div>
                        <div class="layui-form-item layui-form-text">
                            <label class="layui-form-label">备注</label>
                            <div class="layui-input-block">
                                <textarea name="tip" placeholder="备注" class="layui-textarea"></textarea>
                            </div>
                        </div>
                        <button type="submit" class="layui-btn layui-btn-normal" lay-submit="" lay-filter="component-form-element">添加</button>
                        <button type="reset" class="layui-btn layui-btn-warm">重置</button>
                    </div>
                    <!--form元素结束-->
                </div>
            </div>
        </div>
    </div>
    <script>
        //Demo
        layui.use('form', function(){
            var form = layui.form;
            //监听提交
            form.on('submit(component-form-element)', function (data) {
                //$('.layui-btn').addClass('layui-disabled').attr('disabled','disabled');
                var index = layer.load();
                $.ajax({
                    url:"{:url('admin/menu/rule_index_add')}",
                    type:'post',
                    dataType:'json',
                    data:data.field,
                    success:function(res){
                        if (res.data == 1) {
                            layer.close(index);
                            layer.open({
                                title: '添加菜单成功'
                                ,content: res.message
                            });
                        } else if (res.data == 0) {
                            layer.close(index);
                            layer.open({
                                title: '添加菜单失败'
                                ,content: res.message
                            });
                        } else {
                            layer.close(index);
                            layer.open({
                                title: '添加菜单失败'
                                ,content: '出现未知错误，如果问题一直出现，您可以联系管理员'
                            });
                        }
                    },error:function () {
                        layer.close(index);
                        layer.open({
                            title: '添加菜单失败'
                            ,content: '当前网络环境不安全，拒绝登录，请调整网络环境'
                        });
                    }
                })
            });
        });
    </script>
    <script>
        layui.use(['iconPicker'], function () {
            var iconPicker = layui.iconPicker;

            iconPicker.render({
                // 选择器，推荐使用input
                elem: '#iconPicker',
                // 数据类型：fontClass/unicode，推荐使用fontClass
                type: 'fontClass',
                // 是否开启搜索：true/false
                search: true,
                // 点击回调
                click: function (data) {
                    console.log(data);
                }
            });

            /**
             * 选中图标 （常用于更新时默认选中图标）
             * @param filter lay-filter
             * @param iconName 图标名称，自动识别fontClass/unicode
             */
            iconPicker.checkIcon('iconPicker', 'layui-icon-star-fill');

        });
    </script>
    <!-- 全局js -->
    {include file="public/footer" /}
</body>
</html>
